<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

	<link rel="stylesheet" href="js/jQuery/themes/base/jquery.ui.all.css">
	<script src="js/jQuery/jquery-1.8.2.js"></script>
	<script src="js/jQuery/ui/jquery.ui.core.js"></script>
	<script src="js/jQuery/ui/jquery.ui.widget.js"></script>
	<script src="js/jQuery/ui/jquery.ui.datepicker.js"></script>
	<link rel="stylesheet" href="js/jQuery/demos.css">

<script>
	$(function() {
		$( "#datepicker1Date" ).datepicker();
		$( "#datepicker2Date" ).datepicker();
		$('#chooseDates').click(function(){
			var dateFrom = $( "#datepicker1Date" ).val();
			var dateTo = $( "#datepicker2Date" ).val();
			$.get(
					'reports/allUsersReport.jsp',
					{
						dateFrom : dateFrom, dateTo: dateTo
					},
					function (content) {
						$('#contentDate').html(content);
						return false;
					}
				);
		});
	});
</script>

</head>
<body>
<center>
	<h2>Raport wszystkich ankieterów</h2>
	<table style="margin-top: 30px; width: 600px;">
		<tr>
			<td style="width: 120px;">Data początkowa</td>
			<td>
				<input type="text" id="datepicker1Date" style="width: 110px; ">
			</td>
			<td>Data końcowa</td>
			<td>
				<input type="text" id="datepicker2Date" style="width: 110px; ">
			</td>
			<td><input type="submit" value="Wyszukaj" style="width: 100px; height: 30px;" id="chooseDates"></td>
		</tr>
	</table>
	
	<div id="contentDate">
						
	</div>
</center>
	
</body>
</html>